<template>
  <view
    class="avatar"
    :style="{
      height: size,
      width: size,
      backgroundColor:bgColor
    }"
  >
    <image
      :src="src"
      :style="{
        height: size,
        width: size
      }"
    ></image>
  </view>
</template>

<script>
export default {
  name: "avatar",
  inheritAttrs: false,
  props: {
    src: String,
    size: {
      type: String,
      default: "80upx"
    },
    center: {
      type: Boolean,
      default: true
    },
    bgColor: {
      type: String,
      default: "#f0f0f0"
    }
  }
};
</script>

<style lang="scss">
.avatar {
  overflow: hidden;
  border-radius: 100%;
  color: #333333;
  /* #ifndef APP-NVUE */
  display: flex;
  /* #endif */
  flex-direction: row;
  justify-content: center;
  text-align: center;
}
</style>
